'use strict';

import {
    StyleSheet,
    View,
    TouchableOpacity,
    Navigator,
    ScrollView,
    NavigatorIOS,
    Text,
    AsyncStorage,
    TouchableHighlight
} from 'react-native';
import React from 'react';
import Icon from 'react-native-vector-icons/Ionicons';
import URL from '../config/server';
import {Utils} from '../config/utils';
import {Key} from '../config/key';


const NavigationBarRouteMapper = {
    LeftButton(route, navigator, index, navState) {
        return (
            <TouchableOpacity style={{flex: 1, justifyContent: 'center'}}
                              onPress={() => navigator.parentNavigator.pop()}>
                <View style={{flexDirection:'row',padding:5}}>
                    <Icon name="ios-arrow-back" size={18} color="#ffffff" style={{alignSelf:'center'}}/>
                    <Text style={{color: 'white', margin: 3,fontSize:16}}>
                        返回
                    </Text>
                </View>
            </TouchableOpacity>
        );
    },
    RightButton(route, navigator, index, navState) {
        return null;
    },
    Title(route, navigator, index, navState) {
        return (
            <Text style={{color: 'white', margin: 10, fontSize: 20}}>
                升级规则
            </Text>
        );
    }
};

export default class MyOut extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            content:''
        };
    }

    componentWillMount() {
        this.fetchSpreadNum()
    }

    fetchSpreadNum() {
        let that = this;
        const SPREAD_NUM = URL.local + 'upbyInfo';
        Utils.get1(SPREAD_NUM, function (data) {
            console.log(data);
            that.setState({
                content:data
            })
        })
    }

    renderScene() {
        return (
            <ScrollView style={styles.container}>
                <View>
                    <TouchableOpacity onPress={()=>{this.props.navigator.push({id: 'Register'});}}>
                        <Text style={styles.quickReg}>
                        快速注册通道
                        </Text>
                    </TouchableOpacity>
                    <Text style={styles.p}>
                        {this.state.content}
                    </Text>
                </View>
            </ScrollView>
        );
    }

    render() {
        return (
            <Navigator
                renderScene={this.renderScene.bind(this)}
                navigator={this.props.navigator}
                navigationBar={
            <Navigator.NavigationBar
                style={{backgroundColor: '#e02820', alignItems: 'center'}}
                routeMapper={NavigationBarRouteMapper} />
          }/>
        );
    }
}

const styles = StyleSheet.create({
    nav: {
        flex: 1
    },
    container: {
        flex: 1,
        paddingTop: 90,
        backgroundColor: '#f5f5f9',
        paddingLeft: 10,
        paddingRight: 10
    },
    p: {
        textAlign: 'justify',
        fontSize: 15,
        padding: 10,
    },
    quickReg:{
        textAlign:'center',
        color:'#e02820'
    }
});


